<template>
  <header>
    <slot>
      <div @click="navBack">
        <svg-icon name="back" color="#fff"></svg-icon>
      </div>
      <p>{{text}}</p>
    </slot>
  </header>
</template>

<script>
export default {
  props: {
    text: String
  },

  methods: {
    navBack () {
      console.log(111)
      this.$router.back(-1)
    }
  }
}
</script>

<style scoped>
header {
  width: 100%;
  height: 96px;
  background-color: #67B85F;
  display: flex;
  align-items: center;
}
header > div {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-items: center;
}
header > p {
  font-size: 36px;
  color: #fff;
}
</style>
